import React, {useEffect, useState } from "react";
import { Card, Avatar} from 'antd';


const HomeUserShow =  () => {
  const [UserInfor, setUserInfor] = useState({})
  /**
   * @date: 2024-10-10 17:21:21
   * @description: useEffect可以接受两个参数：一个函数和一个可选的依赖数组。该函数会在组件挂载后执行（首次渲染前），并在每次依赖数组中的值发生变化时重新执行。这使得它非常适合处理那些需要在组件生命周期的不同阶段进行的副作用操作。
   * @modifyContent:
   * @author: Forever丿顾北
  **/
  useEffect(() =>{
    setUserInfor(JSON.parse(window.localStorage.getItem('userInfo')))
  }, [])
  return (
    <Card hoverable className="margin_bottom">
      <div className="home_usre_top margin_bottom">
        <div className="home_usre_box_left margin_right">
          <Avatar size={100} src={UserInfor.userAvatar}/>
        </div>
        <div className="home_usre_box_right margin_left">
          <h3 className="margin_bottom_clear">{ UserInfor.userName }</h3>
          <h6 className="margin_bottom_clear">{ UserInfor.userAuthority === '1' ? '超级管理员' : UserInfor.userAuthority === '2' ? '普通用户' : '/' }</h6>
        </div>
      </div>
      <div className="home_usre_bottom">
        <p>上次上线时间: <span>{ UserInfor.lastLoginTime }</span></p>
        <p>上次登录地点: <span>{ UserInfor.lastLoginAddress }</span></p>
      </div>
    </Card>
  )
}
export default HomeUserShow;